<template>
  <div class="sure">
    <van-nav-bar
      title="确认订单"
      left-text=""
      left-arrow
      :z-index=99
      @click-left="routeToPath('')"
    />
    <div class="list">
      <span>环球影城（成人票）</span>
      <span class="price">￥352.00</span>
      <span>2</span>
    </div>
    <div class="list">
      <span>总计</span>
      <span class="price">￥752.00</span>
    </div>

    <h5>购票须知</h5>
    <ul>
      <li v-for="i in 4">
        <van-icon name="success" />
        儿童具体年龄请查看门票详情
      </li>
    </ul>
    <div class="submit" @click="clickSubmit">
      立即支付 ￥708.40
    </div>
  </div>
</template>

<script>
import { Icon } from 'vant';
import { NavBar } from 'vant';
export default {
  components: {
    [Icon.name]:Icon,
    [NavBar.name]:NavBar,
  },
  data(){
    return {
      buyNum: 1,
      selectActive: 0
    }
  },
  methods: {
    clickSubmit() {
      this.$router.push('/orders/sure')
    }
  }
}
</script>

<style lang="scss" scoped>
.sure{
  padding: 0 .4rem;
}
.list{
  margin: .4rem 0;
  padding: .4rem 0;
  margin-bottom: 0;
  border-top: 1px solid #eee;
  text-align: center;
  .price{
    padding: 0 .5rem;
    color: #F56C6C;
  }
  span{
    display: inline-block;
  }
  span:nth-child(1){
    text-align: center;
    width: 45%;
  }
  span:nth-child(2){
    width: 26%;
  }
}
.list:nth-child(2){
  margin-top: 0;
}
h5{
  margin-top: 3rem;
  padding: .4rem 0;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
}
li{
  line-height: .8rem;
  color: #888;
  font-size: .36rem;
}

</style>
